<template>
  <view>
    <view v-if="data.length > 0">
      <view
        v-for="(item, index) in data"
        :key="index"
        class="flex items-center"
        @click="select(index)"
      >
        <view class="w-1/12 mr-1" v-if="selectedArr.indexOf(index) !== -1">
          <u-icon name="/static/icons/icon-checked.png" size="36"></u-icon>
        </view>
        <view class="w-1/12 mr-1" v-else
          ><u-icon name="/static/icons/icon-check.png" size="36"></u-icon
        ></view>
        <view class="w-11/12 border-b-gray py-1">
          <view class="flex justify-between">
            <view class="text-base text-dark leading-6">{{
              item.type == 1 ? '提现' : '收益'
            }}</view>
            <view class="text-lg text-dark font-medium leading-6"
              >{{ item.type == 1 ? '-' : '+' }}{{ item.amount }}</view
            >
          </view>
          <view class="flex justify-between">
            <view class="text-xs text-darkNormal leading-6">{{
              item.createTime
            }}</view>
            <view class="text-xs text-darkNormal leading-6 flex"
              ><view
                v-if="(item.status != 0 && item.type == 1) || item.source == 1"
                @click.stop="showTip(item)"
                ><view class="mr-2 mt-2" v-if="item.isShow"
                  ><u-icon name="arrow-up" size="24"></u-icon></view
                ><view class="mr-2 mt-2" v-else
                  ><u-icon name="arrow-down" size="24"></u-icon></view></view
              ><text v-if="item.status == 0 && item.type == 1">处理中</text
              ><text v-else-if="item.status == 1 && item.type == 1">成功</text
              ><text v-else-if="item.status == 2 && item.type == 1">失败</text
              ><text v-else-if="item.source == 1">商家</text
              ><text v-else-if="item.source == 0">服务商</text></view
            >
          </view>
          <view class="text-xs text-darkNormal leading-5" v-show="item.isShow"
            ><text v-if="item.source == 1">活动编号 {{ item.activityNo }}</text
            ><text v-else>{{ item.remark }}</text></view
          >
        </view>
      </view>
    </view>
    <view v-else class="text-center text-sm leading-8 text-gray"
      >- 暂无数据 -</view
    >
  </view>
</template>

<script>
export default {
  props: {
    data: {
      type: Array,
      default: () => {
        return [];
      },
    },
    selected: {
      type: Array,
      default: () => {
        return [];
      },
    },
    type: {
      type: String,
      default: 'single', //single单选   multiple 多选
    },
  },
  data() {
    return {
      selectedArr: [],
    };
  },
  watch: {
    selected: {
      handler(val) {
        this.selectedArr = val;
      },
    },
    selectedArr: {
      handler(val) {
        let arr = [];
        val.forEach((el) => {
          arr.push(this.data[el]);
        });
        this.$emit('update', arr);
      },
      deep: true,
    },
  },
  methods: {
    select(index) {
      if (this.type === 'single') {
        //单选
        if (this.selectedArr[0] !== index) {
          this.selectedArr = [];
          this.selectedArr.push(index);
        } else {
          this.selectedArr = [];
        }
      } else {
        //可多选
        let searchIndex = this.selectedArr.indexOf(index);
        if (searchIndex === -1) {
          this.selectedArr.push(index);
        } else {
          this.selectedArr.splice(searchIndex, 1);
        }
      }
    },
    //显示提示
    showTip(item) {
      item.isShow = !item.isShow;
    },
  },
};
</script>
<style></style>
